<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="../../../dhtmlxToolbar/codebase/skins/dhtmlxtoolbar_dhx_skyblue.css"/>
<link rel="stylesheet" type="text/css" href="../../codebase/skins/dhtmlxpopup_dhx_skyblue.css"/>
<script src="../../codebase/dhtmlxcommon.js"></script>
<script src="../../../dhtmlxToolbar/codebase/dhtmlxtoolbar.js"></script>
<script src="../../codebase/dhtmlxpopup.js"></script>
<style>
#myToolbar {
margin: 10px;
}
</style>
<script>
var myToolbar;
var myPop;
function doOnLoad() {
myToolbar = new dhtmlXToolbarObject("myToolbar", "dhx_skyblue");
myToolbar.setIconsPath("../common/imgs/");
myToolbar.loadXML("../common/toolbar.xml?etc=" + new Date().getTime(), function() {
myToolbar.setItemText("workbut", "List On Right");
myToolbar.addButton("workbut2", 0, "List On Left", "settings.gif");
myToolbar.addSeparator("s1", 1);
myToolbar.addButton("workbut3", 6, "List In Middle", "settings.gif");
myToolbar.addSpacer("workbut3");
myPop = new dhtmlXPopup({
toolbar: myToolbar,
id: ["workbut", "workbut2", "workbut3"]
});
myPop.attachList("name,price", [{
id: 1,
name: "Audi A5 Coupe",
price: "€ 31,550"
}, {
id: 2,
name: "Audi A5 Sportback",
price: "€ 30,990"
}, myPop.separator, {
id: 3,
name: "Audi A6",
price: "€ 30,990"
}, {
id: 4,
name: "Audi A6 Avant",
price: "€ 37,450"
}, {
id: 5,
name: "Audi A6 Quattro",
price: "€ 55,360"
}, myPop.separator, {
id: 6,
name: "Audi TT Coupe",
price: "€ 29,830"
}, {
id: 7,
name: "Audi TT RS Coupe",
price: "€ 59,800"
}]);
});
}
</script>
<style>
</style>
<div id="myToolbar"></div>